import 'dart:math';

import 'package:bottom_picker/bottom_picker.dart';
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:flutterproject/mvvm/base/base_state.dart';
import 'package:flutterproject/page/mine/children/assets/childdren/exchage/controller/exchange_controller.dart';
import 'package:flutterproject/page/mine/children/assets/childdren/formatter.dart';
import 'package:flutterproject/page/mine/children/assets/controller/my_assets_controller.dart';
import 'package:flutterproject/page/mine/children/assets/data/assets_detail_bean.dart';
import 'package:flutterproject/util/dialog_toast/dialog_util.dart';
import 'package:flutterproject/util/extension/extension_util.dart';
import 'package:flutterproject/util/extension/widget_extension.dart';
import 'package:flutterproject/util/margin_padding_util.dart';
import 'package:flutterproject/widget/app_bar_common.dart';
import 'package:flutterproject/widget/button_common.dart';
import 'package:flutterproject/widget/image_extended.dart';
import 'package:flutterproject/widget/text/text_common.dart';
import 'package:flutterproject/widget/text/text_field_common.dart';
import 'package:get/get.dart';

class ExchangePage extends BaseState<ExchangeController> {
  final AssetsDetailBean? bean;

  ExchangePage(this.bean);

  @override
  ExchangeController initController() => ExchangeController();

  @override
  Widget initView(BuildContext context) {
    final rate = bean?.price ?? 1;
    return ColoredBox(
      color: Color(0xFFF6F6F6),
      child: Column(
        children: [
          AppBarCommon(
            title: "兑换",
            bgColor: Color(0xFFEDC88B),
            leftColor: Colors.white,
            titleColor: Colors.white,
          ),
          Container(
            margin: MarginPaddingUtil.only(top: 78, left: 40, right: 40),
            padding: MarginPaddingUtil.fromLTRB(
                left: 30, top: 47, right: 30, bottom: 61),
            decoration: BoxDecoration(
              color: Colors.white,
              borderRadius: BorderRadius.circular(20.radius),
            ),
            child: Column(
              children: [
                Row(
                  children: [
                    TextCommon(
                      "实时汇率",
                      size: 28.sp,
                      fontWeight: FontWeight.bold,
                      color: Color(0xFFEDC88B),
                    ),
                    24.widthBox,
                    TextCommon(
                      "$rate",
                      size: 28.sp,
                      fontWeight: FontWeight.bold,
                      color: Color(0xFFEDC88B),
                    )
                  ],
                ),
                _buildBg(
                  child: TextCommon(
                    "绿色积分",
                    size: 28.sp,
                    fontWeight: FontWeight.bold,
                  ),
                ),
                ImageCommon(
                  "/icon/ic_down",
                  size: 36.width,
                ),
                Container(
                  width: Get.width,
                  height: 200.height,
                  child: Stack(
                    children: [
                      _buildBg(
                          child: TextCommon(
                            controller.popWindowValue,
                            size: 28.sp,
                            fontWeight: FontWeight.bold,
                          ),
                          showRight: true),
                      if (controller.isExpand) _buildPopWindow()
                    ],
                  ),
                ),
                Row(
                  children: [
                    TextCommon(
                      "可兑换额度",
                      size: 28.sp,
                      fontWeight: FontWeight.bold,
                      color: Color(0xFFEDC88B),
                    ),
                    24.widthBox,
                    TextCommon(
                      "${(bean?.balance ?? 0).toDouble()}",
                      size: 28.sp,
                      fontWeight: FontWeight.bold,
                      color: Color(0xFFEDC88B),
                    )
                  ],
                ),
                40.heightBox,
                _buildBg(
                    child: TextCommon(
                      "输入兑换额度",
                      size: 28.sp,
                    ),
                    textEditingController: controller.topController,
                    inputFormatters: [InputFormatter()],
                    onChange: (value) {
                      controller.bottomController.text =
                          "${(double.tryParse(value) ?? 0) * rate}";
                    }),
                ImageCommon(
                  "/icon/ic_down",
                  size: 36.width,
                ),
                _buildBg(
                  child: TextCommon(
                    "获得额度",
                    size: 28.sp,
                  ),
                  textEditingController: controller.bottomController,
                  readOnly: true,
                ),
                60.heightBox,
                ButtonCommon(
                  text: "确定兑换",
                  onTap: () => showPwdDialog(),
                  width: 472.width,
                  color: Color(0xFFEDC88B),
                  borderRadios: 30.radius,
                  fontColor: Colors.white,
                  fontSize: 36.sp,
                  fontWeight: FontWeight.bold,
                  padding: MarginPaddingUtil.symmetric(vertical: 20),
                ),
              ],
            ),
          ),
        ],
      ),
    );
  }

  Widget _buildBg({
    required Widget child,
    TextEditingController? textEditingController,
    bool readOnly = false,
    List<TextInputFormatter>? inputFormatters,
    ValueChanged<String>? onChange,
    bool showRight = false,
  }) {
    return Container(
      padding: textEditingController == null
          ? MarginPaddingUtil.all(40)
          : MarginPaddingUtil.symmetric(vertical: 24, horizontal: 40),
      margin: MarginPaddingUtil.only(top: 30, bottom: 17),
      decoration: BoxDecoration(
        color: Color(0xFFF6F6F6),
        borderRadius: BorderRadius.circular(32.radius),
      ),
      child: Row(
        children: [
          child,
          if (showRight)
            Expanded(
              child: Row(
                children: [
                  Spacer(),
                  Transform.rotate(
                    angle: controller.isExpand ? pi : 0,
                    child: ImageCommon(
                      "/icon/arrow-down",
                      width: 25.width,
                      height: 20.height,
                    ),
                  ),
                ],
              ).addClickEvent(() {
                BottomPicker(
                  items: ["酝积分", "创投积分"]
                      .map((e) => Text(
                    e,
                  ))
                      .toList(),
                  title: '',
                  pickerTextStyle: TextStyle(
                      color: Colors.black,
                      fontSize: 24.sp,
                      fontWeight: FontWeight.bold,
                      height: 2.2),
                  dismissable: true,
                  displayButtonIcon: false,
                  buttonText: "确定",
                  buttonTextStyle: TextStyle(
                    color: Colors.black,
                    fontSize: 24.sp,
                    fontWeight: FontWeight.bold,
                  ),
                  buttonSingleColor: Colors.grey.withOpacity(0.5),
                  onSubmit: (_) {
                    controller.popWindowValue = _ == 0 ? "酝积分" : "创投积分";
                    controller.update();
                  },
                ).show(Get.context!);
              }),
            ),
          if (textEditingController != null)
            Expanded(
                child: TextFieldCommon(
              align: TextAlign.right,
              controller: textEditingController,
              height: 72.width,
              size: 50.sp,
              textColor: Colors.black,
              padding: MarginPaddingUtil.symmetric(horizontal: 25),
              readOnly: readOnly,
              inputFormatters: inputFormatters,
              onChanged: onChange,
            ))
        ],
      ),
    );
  }

  void showPwdDialog() {
    DialogUtil.showPwdDialog((value) {
      Get.find<MyAssetsController>().exchange(
          value,
          controller.topController.text,
          controller.popWindowValue == "酝积分" ? 1 : 5);
    });
  }

  /// 酝积分和创投积分的下拉选择
  Widget _buildPopWindow() {
    return Positioned(
      right: 23.width,
      top: 98.height,
      child: Container(
        padding: MarginPaddingUtil.symmetric(vertical: 15, horizontal: 20),
        decoration: BoxDecoration(
          color: Color(0xFF969696),
          borderRadius: BorderRadius.circular(12.radius),
        ),
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            TextCommon(
              "酝积分",
              color: Colors.white,
              size: 24.sp,
              lineHeight: 35.sp,
            ).addClickEvent(() {
              controller.popWindowValue = "酝积分";
              controller.isExpand = false;
              controller.update();
            }),
            TextCommon(
              "创投积分",
              color: Colors.white,
              size: 24.sp,
              lineHeight: 35.sp,
            ).addClickEvent(() {
              controller.popWindowValue = "创投积分";
              controller.isExpand = false;
              controller.update();
            }),
          ],
        ),
      ),
    );
  }
}
